<template>
	<view class="pad-32r">
		<SearchButtonVue></SearchButtonVue>
		<view class="pad-32r">
			<view class="border-col">选择医废类型</view>
			<view>
				<view v-for="(item,index) in listMedicalWaste">
					<view class="waste" @click="toPage(item)">
						<view class="center">
							<u--image v-if="item.src" :src="baseURL+item.src" width="30px" height="30px" shape="circle"
								@click="clickSaoyisao"></u--image>
							<view v-else class="normal-no-img"></view>
						</view>
						<view class="mar-10">
							<view>{{item.name}}</view>
							<view class="color-gray font-size-12">{{item.describe}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import SearchButtonVue from '../../components/SearchButton.vue';
	import {
		mapGetters,
		mapActions
	} from 'vuex'
	export default {
		components: {
			SearchButtonVue
		},
		computed: {
			...mapGetters(['baseURL']),
		},
		data() {
			return {
				listMedicalWaste: [{
						name: '感染性废物',
						src: '',
						describe: '隔离废物,传染性病原体的培养物和储存物..',
						id: 1
					},
					{
						name: '损伤性废物（利器盒)',
						src: '',
						describe: '医用针头、缝合针,各类医用锐器等',
						id: 2
					},
					{
						name: '化学性废物（袋装)',
						src: '',
						describe: '指具有毒性、腐蚀性、易燃易爆性的废弃的化学物品.',
						id: 3
					},
					{
						name: '病理性废物（袋装)',
						src: '',
						describe: '诊疗过程中产生的人体废弃物和医学实验动物尸体等',
						id: 4
					}
				]
			}
		},
		methods:{
			toPage(item){
				uni.$u.route('/pages/medicalWaste/MedicalWasteRegister', item);
			}
		}
	}
</script>

<style scoped>
	.waste {
		display: flex;
		justify-content: flex-start;
		align-items: center;

		
	}
	.waste .normal-no-img {
			width: 30px;
			height: 30px;
			background-color: gray;
			border-radius: 90px;
		}
</style>